<nz-layout>

  <nz-content>
    <div nz-row [nzGutter]="40">
      <div nz-col [nzSpan]="6" *ngFor="let data of dataSet;let i = index">
        <nz-card [class]="'bg'+getIndex(i)" (mouseenter)="hover(i)" (mouseleave)="leave(i)">
          <div class="zl" *ngIf="!data.listshow">
            <img [src]="'../../../assets/img/pro_operate_icon_'+getIndex(i)+'.png'" alt="">
            <p>{{ data.proname }}</p>
            <span>共{{data.count}}个项目</span>
          </div>
          <div class="shadow" *ngIf="data.shadow"></div>
          <ul *ngIf="data.listshow">
            <li style="padding-left: 3px; padding-right: 3px;" *ngFor="let subjectlist of data.subject;let sub = index"
              [class]="subjectlist.isChecked ? 'strong' : ''" (click)="choose(sub,i,subjectlist.id,data.id,data.teacherId)">{{subjectlist.subjectName}}</li>
          </ul>
        </nz-card>
      </div>

    </div>

    <div style="font-size: 18px;padding-left:25px;line-height: 36px" *ngIf="!stop">演练类型</div>
    <div nz-row [nzGutter]="40" *ngIf="!stop">
      <div nz-col [nzSpan]="6" *ngIf="this.selectSubject&& this.selectSubject.drillSubjectType == 1">
        <nz-card style="height: 108px;" class="pro_type_bg1 pro_type" (click)="showModal('1')">
          <div class="text">
            开始演练
          </div>
        </nz-card>
      </div>
      <div nz-col [nzSpan]="6" *ngIf="this.selectSubject&& this.selectSubject.drillSubjectType == 2">
        <nz-card style="height: 108px;" class="pro_type_bg1 pro_type" (click)="showModal('2')">
          <div class="text">
            开始演练
          </div>
        </nz-card>
      </div>
      <div nz-col [nzSpan]="6" *ngIf="this.selectSubject&& this.selectSubject.drillSubjectType == 0">
        <nz-card style="height: 108px;" class="pro_type_bg1 pro_type" (click)="showModal('1')">
          <div class="text">
            自由演练
          </div>
        </nz-card>
      </div>
      <div nz-col [nzSpan]="6" *ngIf="this.selectSubject&& this.selectSubject.drillSubjectType == 0">
        <nz-card style="height: 108px;" class="pro_type_bg2 pro_type">
          <p class="text">
            角色演练
          </p>
          <ul>
            <li *ngFor="let role of roleList" (click)="showModalroleid(2,role.id)">{{role.drillRoleName}}</li>
          </ul>
        </nz-card>
      </div>
      <div nz-col [nzSpan]="6" *ngIf="this.selectSubject&& this.selectSubject.drillSubjectType == 0">
        <nz-card style="height: 108px;" class="pro_type_bg3 pro_type" (click)="showModal('3')">
          <div class="text">
            分组演练
          </div>
        </nz-card>
      </div>
    </div>
    <!--<nz-pagination style="margin-right:25px;float:right" [nzPageIndex]="1" [nzPageSize]="12" [nzTotal]="4"></nz-pagination>-->

    <nz-modal [(nzVisible)]="isVisible" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()" [nzOkLoading]="isOkLoading">
      <div class="add_title">
        开始实训
      </div>
      <p style="width: 100%;text-align: center;font-size: 16px">是否确认创建课程?</p>
    </nz-modal>
  </nz-content>
</nz-layout>
